<template>
  <v-app>
    <quill-editor
      v-model="content"
      ref="myQuillEditor"
      :options="editorOption"
      @blur="onEditorBlur($event)"
      @focus="onEditorFocus($event)"
      @ready="onEditorReady($event)"
    >
    </quill-editor>
  </v-app>
</template>

<script>
import "quill/dist/quill.core.css";
import "quill/dist/quill.snow.css";
import "quill/dist/quill.bubble.css";

import { quillEditor } from "vue-quill-editor";
export default {
  components: {
    quillEditor,
  },
  data: () => ({
    content: "<p class=\"ql-align-center\"><strong style=\"color: blue;\">5种学习风格解析+5种学习类型</strong></p><p><span style=\"color: blue;\">&nbsp;</span></p><p><span style=\"color: black;\">&nbsp;</span></p><p><span style=\"color: black;\">认知型</span></p><p>目标掌控相当执着，会倾向以自己的力量达成学习结果，无论是内在还是外在，具有相当强度的抗压力，遇到事情会想办法自行解决，相当注重价值与爱面子。</p><p>&nbsp;</p><p>学习中通常具有很好的精神状态，为了达到目的相当努力，学习中容易出现的问题：</p><p>&nbsp;</p><p>◆ 主动积极&nbsp;◆ 自我中心&nbsp;◆ 注重尊严</p><p>◆ 缺乏共情&nbsp;◆ 自私倾向&nbsp;◆ 具侵略性</p><p>◆ 不善配合&nbsp;◆ 创造环境&nbsp;◆ 抵抗情绪</p><p>&nbsp;</p><p>教育指导;</p><p>◆ 结合环境体验，让孩子自行选择目标</p><p>◆ 竞争性强，拥有很好的契约精神</p><p>◆ 实际的物质奖励能够有效激发学习动机</p><p>◆ 不可以强势掌控，容易激发抵抗情绪</p><p>◆ 沟通、协商制定标准，不可不劳而获</p><p>&nbsp;</p><p>&nbsp;</p><p><span style=\"background-color: white; color: black;\">开放型</span></p><p><span style=\"background-color: white; color: black;\">对各种事情都充满兴趣，善于接纳与整合资源，学习态度良好，只是特别容易受到环境影响，导致缺乏专注力与意志力，容易出现目标转移、喜新厌旧的情况。</span></p><p><span style=\"background-color: white; color: black;\">&nbsp;</span></p><p><span style=\"background-color: white; color: black;\">学习中通常具有较好的精神状态，很在意大家的评价，学习中容易出现的问题：</span></p><p>◆ 兴趣广泛&nbsp;&nbsp;&nbsp;◆ 交头接耳&nbsp;&nbsp;◆ 注重形象</p><p>◆ 情感细腻&nbsp;&nbsp;&nbsp;◆ 犹豫不决&nbsp;&nbsp;◆ 决策缓慢</p><p>◆ 变化性大&nbsp;&nbsp;&nbsp;◆ 目标转移&nbsp;&nbsp;◆ 适应环境</p><p>&nbsp;</p><p>教育指导：</p><p>◆ 多参加才艺学习，不建议马上决策</p><p>◆ 结合多元智能分析报告，锁定目标坚持学习</p><p>◆ 目标转移中，请结合时间管理表，分类执行</p><p>◆ 推荐使用二选一决策法锁定目标</p><p>◆ 培养契约精神使其专注执行</p><p>&nbsp;</p><p><span style=\"color: black;\">模仿型</span></p><p>近朱者赤近墨者黑，情感需求高，非常在意大家的评价，喜欢与伙伴共同学习，学习过程中要相当注意自己的言传身教，配合度高，需要及时给予指令。</p><p>&nbsp;</p><p>学习中通常具有和谐的态度，为了达到目标相当有耐性，学习中容易出现的问题：</p><p>◆ 缺乏主动&nbsp;◆ 易受影响&nbsp;◆ 情感需求</p><p>◆ 同理心重&nbsp;◆ 不善拒绝&nbsp;◆ 具配合性</p><p>◆ 情感丰富&nbsp;◆ 善于模仿&nbsp;◆ 可塑性高</p><p>&nbsp;</p><p>教育指导：</p><p>◆ 注意情绪变化，保持和谐的态度交流与学习</p><p>◆ 注意社交，避免近朱者赤近墨者黑</p><p>◆ 可塑性高，结合环境影响培养好习惯</p><p>◆ 学习过程中需要较多时间陪伴与指导</p><p>◆ 切勿用强势态度，批判会造成强大的精神压力</p><p>◆ 借助工具，身心智全面发展</p><p>◆ 不可散养，学习过程不可要求太快的速度</p><p>&nbsp;</p><p><span style=\"color: black;\">逆思型</span></p><p>善于从不同角度进行思考与探索，喜欢提问同时具有质疑和批判的特质，具有极高的创新能力，结合多元智能分析，可以培养为优秀的创新型人才。</p><p>&nbsp;</p><p>学习中通常具有较高的好奇心，善于提问，学习中容易出现的问题：</p><p>◆ 逆向思考&nbsp;◆ 好奇心重&nbsp;◆ 喜欢提问</p><p>◆ 具批判性&nbsp;◆ 善于拒绝&nbsp;◆ 具破坏力</p><p>◆ 具创造力&nbsp;◆ 在意感受&nbsp;◆ 不喜刻板</p><p>&nbsp;</p><p>教育指导：</p><p>◆ 善于从不同角度分析问题，家长不可强势改变</p><p>◆ 经常有奇怪的问题，或者重复性提问，家长需要足够的耐心</p><p>◆ 保持鲜活的思维与处理问题问题的方法，不喜欢太刻板的模式</p><p>◆ 尝试从不同角度分析问题，并且理解对方的思维模式</p><p>◆ 培养创意能力，通过交流沟通理解其动机</p><p>◆ 通常容易被误解，接纳比强迫一致更重要</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p><span style=\"color: black;\">反射型</span></p><p>大脑中潜藏的天赋，持续学习没有天花板，活到老学到老，具学霸型特质；通过多元智能分析，了解其天赋所在，后天环境大量学习使其成为专业型人才。</p><p>&nbsp;</p><p>学习中通常具有较强的稳定性，善于钻研，学习中容易出现的问题：</p><p>◆ 有教有学&nbsp;&nbsp;◆ 不教不学&nbsp;◆ 天性谨慎</p><p>◆ 善于沉思&nbsp;&nbsp;◆ 安全意识&nbsp;◆ 缺乏主动</p><p>◆ 可塑性高&nbsp;&nbsp;◆ 务实苦干&nbsp;◆ 不喜压力</p><p>&nbsp;</p><p>教育指导：</p><p>◆学习中不可要求太快的学习速度</p><p>◆在熟悉的环境中才能展现出高质量学习能力</p><p>◆持续培养将有助于成为优秀人才</p><p>◆基础教育需要进行大量感统训练</p><p>◆和谐相处、耐心热情，使其倍感舒适</p><p>◆强势态度会增加孩子的封闭特性</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p><strong>学习类型</strong></p><p>&nbsp;</p><p><span style=\"color: blue;\">动机型</span></p><p>◆建构契约，达成目标</p><p>◆自我意识强，具竞争力</p><p>◆动机出现全力以赴，全方位学习</p><p>◆不做没有意义或者没有价值的事情</p><p>◆具开创性，喜欢挑战与解决复杂的事情</p><p><span style=\"color: blue;\">&nbsp;</span></p><p><span style=\"color: blue;\">&nbsp;</span></p><p><span style=\"color: blue;\">构思型：</span></p><p>◆ 喜欢思考、爱动脑筋，具有强烈的探索欲望</p><p>◆ 经常呈现出好奇、好问的特质，擅长推理</p><p>◆ 通常反映会“慢一些”，善用心像</p><p>◆ 具高创造力，多幻想，内心活动较多</p><p>◆ 可着重培养空间想象、逻辑推理、语言学习</p><p><span style=\"color: blue;\">体觉型</span></p><p>◆ 通常被误认为好动与专注力缺失</p><p>◆ 喜欢通过运动或者操作的模式进行学习理解</p><p>◆ 目标确定，能够立刻付诸行动，执行力强</p><p>◆ 身体感知强，容易塑造成为专业工作者</p><p>◆ 长时间静态学习反而不容易记忆</p><p>&nbsp;</p><p><span style=\"color: blue;\">听觉型</span></p><p>◆ 对声音、声调、语气、态度相当敏感</p><p>◆ 情绪感知能力强、理解能力加分</p><p>◆ 声音是一把双刃剑</p><p>◆ 喜欢用听得方式学习，问的方式获得信息</p><p>◆ 尤其在音乐艺术或者文科学习具有很好的天赋</p><p>&nbsp;</p><p>&nbsp;</p><p><span style=\"color: blue;\">视觉型</span></p><p>◆ 喜欢通过笔记或者阅读的方式学习</p><p>◆ 善于通过图形、色彩、细节观察进行理解与记忆</p><p>◆ 很容易培养成为优秀的视觉辨识专家</p><p>◆ 培养良好的生活习惯，东西摆放整齐</p><p>◆ 非常在意大家的评价，肯定使其更加积极</p><p>&nbsp;</p>",
    editorOption: {},
  }),
  computed: {
    editor() {
      return this.$refs.myQuillEditor.quill;
    },
  },
  methods: {
    onEditorBlur(quill) {
      console.log("editor blur!", quill);
    },
    onEditorFocus(quill) {
      console.log("editor focus!", quill);
    },
    onEditorReady(quill) {
      console.log("editor ready!", quill);
    },
    onEditorChange({ quill, html, text }) {
      console.log("editor change!", quill, html, text);
      this.content = html;
    },
  },
};
</script>
